:root {
  --hv-primary-color: var(--ant-primary-color);
  --hv-success-color: var(--ant-success-color);
  --hv-warning-color: var(--ant-warning-color);
  --hv-error-color: var(--ant-error-color);

  --hv-item-hover-color: #f5f5f5;
  --hv-white: #fff;
  --hv-black: #000;

  --hv-text-color: fade(#000, 85%);
  --hv-text-color-secondary: fade(#000, 45%);
  --hv-text-color-dark: fade(#fff, 85%);
  --hv-text-color-secondary-dark: fade(#fff, 65%);

  --hv-component-background: #fff;

  --hv-border-color-base: hsv(0, 0, 85%);
  --hv-border-color-split: hsv(0, 0, 94%);
  --hv-border-color-inverse: #fff;
  --hv-border-width-base: 1px;
  --hv-border-style-base: solid;
  --hv-border-radius-base: 2px;
  --hv-border-radius-sm: 2px;
  --hv-border-radius-default: 4px;
  --hv-border-radius-large: 6px;

  --hv-item-hover-bg: #f5f5f5;

  --hv-striped-bg: #fafcff;

  //-------- 滚动条 -----------
  --hv-scrollbar-track: rgba(0, 0, 0, 0);
  --hv-scrollbar-thumb: #999999;
  --hv-scrollbar-thumb-hover: #737373;

  // -------- shadow -----------
  --hv-base-shadow: 0 2px 11px 0 rgba(190, 202, 218, 0.17);
  --hv-hover-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2);
  --hv-light-shadow: 0 1px 5px 0 rgba(25, 50, 79, 0.07), 0 5px 10px 0 rgba(25, 50, 79, 0.1);

  //-------- dark theme--------
  --hv-dark-bor-color: #24262a;
  --hv-dark-color: #f5f5f5;

  --hv-dark-select-dropdown-bg: #272c33;
  --hv-dark-select-dropdown-color: var(--hv-dark-color);
  --hv-dark-select-dropdown-item-select-bg: #393e44;
  --hv-dark-select-dropdown-item-hov-bg: #31383f;

  --hv-dark-input-bg: #393e44;
  --hv-dark-input-color: var(--hv-dark-color);
  --hv-dark-input-height: 24px;
  --hv-dark-input-space: 10px;
  --hv-dark-input-bor-color: #4a4f55;

  --hv-dark-btn-bg: #393e44;
  --hv-dark-btn-color: var(--hv-dark-color);
  --hv-dark-btn-active-bg: #22252b;
  --hv-dark-btn-bor-color: #4a4f55;
  --hv-dark-btn-hov-bg: var(--hv-primary-color);

  --hv-dark-collapse-bg: rgba(111, 127, 142, 0.068);
  --hv-dark-collapse-color: var(--hv-dark-color);
  --hv-dark-collapse-content-bg: #161922;

  --hv-tabs-color:var(--hv-dark-color);

  --hv-confirm-color:var(--hv-dark-color);
  --hv-confirm-bg:#272c33;
  --hv-confirm-btn-bg:#393e44;
  --hv-confirm-btn-bor-color: #4a4f55;

  --hv-dialog-bg:#272c33;
  --hv-dialog-color:var(--hv-dark-color);
  --hv-dialog-header-bg:#2a2f38;
  --hv-dialog-footer-bg:#2a2f38;
  --hv-dialog-btn-bg:#393e44;
  --hv-dialog-btn-bor-color: #4a4f55;

  --hv-popover-color:var(--hv-dark-color);
  --hv-popover-bg:#2a2f38;
  --hv-popover-btn-bg:#393e44;
  --hv-popover-btn-bor-color: #4a4f55;

  //===============应用===============
  --hv-spinning-bg: rgba(255, 255, 255, 0);

  // -------- drawer layout -----------
  --hv-drawer-layout-header-height: 50px;
  --hv-drawer-layout-padding-space: 10px;
  --hv-drawer-layout-footer-height: 50px;

  // -------- rule-tool -----------
  --hv-rule-tool-cale-color: #bfc5ca;
  --hv-ruler-tool-bg: #363a3e;

  //-------- visual layout -----------
  --hv-visual-layout-header-bg: #151922;
  --hv-visual-layout-header-logo-title: #f0f1f3;
  --hv-visual-layout-header-menu-color:#f5f5f5;

  // -------- dashboard -----------

  //------dashboard designer list-----
  --hv-dash-list-bg: #f1f6fb;
  --hv-dash-list-category-item-hov-bg: #cdd9e8;


  //------dashboard designer header-----
  --hv-dash-des-header-height: 40px;
  --hv-dash-des-header-bg: #161922;
  --hv-dash-des-header-input-bg: #393e44;
  --hv-dash-des-header-input-color: #f5f5f5;
  --hv-dash-des-header-input-height: 26px;
  --hv-dash-des-header-log-bg: #272c33;
  --hv-dash-des-header-log-item-color: #f5f5f5;
  --hv-dash-des-header-log-item-hov-bg: #31383f;

  //------dashboard designer component panel-----
  --hv-dash-des-comp-panel-width: 42px;
  --hv-dash-des-comp-panel-bg: #161922;
  --hv-dash-des-comp-panel-fs: 10px;
  --hv-dash-des-comp-panel-icon-fs: 18px;
  --hv-dash-des-comp-panel-color: #fff;
  --hv-dash-des-comp-panel-hov-bg: var(--hv-primary-color);
  --hv-dash-des-comp-panel-hov-color: #fff;
  --hv-dash-des-comp-popover-bg: #272c33;
  --hv-dash-des-comp-popover-width: 210px;
  --hv-dash-des-comp-popover-shadow: 2px 0px 3px rgba(0, 0, 0, 0.15);
  --hv-dash-des-comp-popover-header-height: 40px;
  --hv-dash-des-comp-popover-header-color: #fff;
  --hv-dash-des-comp-popover-header-chc: var(--error-color);
  --hv-dash-des-comp-popover-body-item-color: #f5f5f5;
  --hv-dash-des-comp-popover-body-item-hov-bg: #262b31;
  --hv-dash-des-comp-popover-body-item-hov-color: #fff;
  --hv-dash-des-comp-popover-body-item-b-color: #f2f2f2;
  --hv-dash-des-comp-popover-body-item-b-hov-bg: var(--hv-primary-color);
  --hv-dash-des-comp-popover-body-item-b-hov-c: #fff;

  //------dashboard designer canvas panel-----
  --hv-dash-des-canvas-panel-bg: #363a3e;
  --hv-dash-des-canvas-panel-bottom-height: 20px;
  --hv-dash-des-canvas-panel-bottom-bg: #161922;
  --hv-dash-des-canvas-panel-bottom-item-bg: #353a3f;
  --hv-dash-des-canvas-panel-bottom-item-hov-bg: var(--hv-primary-color);
  --hv-dash-des-canvas-panel-grid-color: rgba(28, 32, 38, 0.6);
  --hv-dash-des-canvas-panel-comp-node-menu-btn-bg: var(--hv-primary-color);
  --hv-dash-des-canvas-panel-comp-node-menu-btn-color: #fff;

  //------dashboard designer config panel-----
  --hv-dash-des-config-panel-width: 330px;
  --hv-dash-des-config-panel-width-bg: #161922;
  --hv-dash-des-config-panel-body-height: calc(100vh - 40px);
  --hv-dash-des-config-panel-body-padding: 14px;

  //------dashboard designer layer panel-----
  --hv-dash-des-layer-panel-bottom-height: 21px;
  --hv-dash-des-layer-panel-bottom-bg: #161922;
  --hv-dash-des-layer-panel-item-color: #f5f5f5;
  --hv-dash-des-layer-panel-item-hov-bg: #363c44;
  --hv-dash-des-layer-panel-item-hov-color: #fff;
  --hv-dash-des-layer-panel-item-input-bg: #101113;
  --hv-dash-des-layer-panel-item-input-color: #f5f5f5;

  //------dashboard designer visual prop-----
  
}
